<template>
  <div class='capital'>
    <div class='top'>
      <div class='left' id='cap'>
        <!-- <div class="block">
          <span class="demonstration" style='color: #30383e;font-size: 14px;'>支付时间：</span>
          <el-date-picker v-model="value6" type="date" placeholder="选择日期" style="width: 152px;">
          </el-date-picker>
        </div> -->
        <!-- <div class="block cap">
          <span class="demonstration" style='font-size: 14px;'>支付时间：</span> -->
       
          <!-- <el-date-picker v-model="ptime" type="datetimerange" start-placeholder="开始日期" end-placeholder="结束日期" range-separator="至"></el-date-picker>
        </div> -->
        <div class="block cap">
          <span class="demonstration" style='font-size: 14px;'>审核时间：</span>
          <!-- {{value6}} -->
          <!-- <el-date-picker v-model="time" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期">
          </el-date-picker>-->
          <el-date-picker v-model="time" type="datetimerange" start-placeholder="开始日期" end-placeholder="结束日期" range-separator="至"></el-date-picker>
        </div>
        <!-- <div class="block">
          <span class="demonstration" style='color: #30383e;font-size: 14px; margin-left: 80px;'>审核时间：</span>
          <el-date-picker v-model="value7" type="date" placeholder="选择日期" style="width: 152px;">
          </el-date-picker>
        </div> -->
        <div class='left_last'>
          <span>当前状态：</span>
          <v-numodule :list='statusarr' ref='status'></v-numodule>
          <button @click='getList'>查询</button>
          <button @click='clear'>重置</button>
        </div>
        <div class='left_last'>
          <button @click='goRouter'>申请建仓</button>
        </div>
      </div>

    </div>
    <div class='capital_table'>
      <div class='moddle'>
        <v-table :list='list' :tableData='tableData' ></v-table>
      </div>
    </div>
    <div class='bottom'>
      <div class="block">
        <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage4" :page-size="pageSize" prev-text="上一页" next-text="下一页" layout="prev, pager, next, jumper, total" :total="total">
        </el-pagination>
      </div>
    </div>
  </div>

</template>
<script>
import table from "../common/table.vue";
import numoudle from "../common/numodule.vue";
import $ from "jquery";
import { Message } from "element-ui";
export default {
  components: {
    "v-table": table,
    "v-numodule": numoudle
  },
  watch: {
    ptime: function(newTime) {
      if (!newTime) return;
      this.pstartTime = t.gshDate(newTime[0]);
      this.pendTime = t.gshDate(newTime[1]);
    },
    time: function(newTime) {
      if (!newTime) return;
      this.startTime = t.gshDate(newTime[0]);
      this.endTime = t.gshDate(newTime[1]);
    }
  },
  mounted() {
    this.getList();
  },
  created() {
    this.$parent.flag = true;
  },
  methods: {
    goRouter() {
      this.$router.push({ path: "/ApplyFor" });
    },
    getList() {
      this.status = this.statusarr.indexOf(this.$refs.status.value);
      u.buildWarehouse(
        {
          currentCount: parseInt(this.currentCount),
          pageSize: this.pageSize,
          endTime: this.endTime,
          // pstartTime: this.pstartTime,
          startTime: this.startTime,
          status: this.status == -1 ? null : this.status,
          // pendTime: this.pendTime
        },
        data => {
          if (data && data.code == "200" && data.data && data.data.list) {
            this.tableData = [];
            this.total = data.data.total;
            data.data.list.forEach((item, index) => {
              var obj = {};
              obj.tda = index + 1;
              obj.tdb = item.total;
              obj.tdc = item.strpType;
              obj.tdd = item.rstPrice;
              obj.tde = item.rstNum;
              obj.tdn = item.pNum;
              obj.tdt = item.channel;
              obj.tdf = item.remitter;
              obj.tdm = item.usdtAddress;
              obj.tdg = item.bankNo;
              obj.tdh = item.receiveDetail;
              obj.tdl = item.strStatus;
              obj.date = item.checkTime;
              obj.datetwo = item.createTime;
              obj.id = item.id;
              this.tableData.push(obj);
            });
          }
        }
      );
    },
    handleSizeChange(val) {},
    handleCurrentChange(val) {
      this.currentCount = this.pageSize * (val - 1);
      this.getList();
    },
    clear() {
      this.endTime = null;
      this.startTime = null;
      this.pstartTime = null;
      this.pendTime = null;
      this.status = null;
      this.ptime = "";
      this.time = "";
      this.$refs.status.value = "";
      this.getList();
    }
  },
  data() {
    return {
      statusarr: ["待审核", "待划拨", "已完成", "已驳回"],
      endTime: null,
      startTime: null,
      pstartTime: null,
      pendTime: null,
      status: null,
      currentCount: 0,
      pageSize: 10,
      ptime: "",
      time: "",
      tableData: [],
      total: 0,
      list: [
        { key: "tda", title: "序号" },
        { key: "tdc", title: "建仓类型" },
        { key: "tdb", title: "建仓金额" },
        // { key: "tdc", title: "实际金额" },
        { key: "tdd", title: "建仓价格" },
        { key: "tde", title: "数量" },
        { key: "tdn", title: "USDT数量" },
        { key: "tdt", title: "付款渠道" },
        { key: "tdf", title: "汇款人" },
        { key: "tdg", title: "卡号/账号" },
        { key: "tdh", title: "收款卡号" },
        { key: "tdm", title: "USDT地址" },
        { key: "tdl", title: "状态" },
        { key: "datetwo", title: "建仓时间" },
        { key: "date", title: "审核时间" }
        // { key: "tdk", title: "操作" }
      ]
    };
  }
};
</script>
<style lang='less' scoped>
@import "../../../static/common/capital.less";
</style>
<style lang='less'>
.cap {
  .el-range-editor.el-input__inner {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 350px !important;
    padding: 3px 10px;
  }
  .el-icon-date {
    border-left: none !important;
    padding-left: 10px;
  }
  .el-range-separator {
    width: 20px !important;
    padding-right: 20px !important;
  }
  .el-date-editor .el-range__icon {
    font-size: 14px;
    margin-left: -5px;
    color: #c0c4cc;
    float: left;
    line-height: 32px;
    // position: relative;
    // left: 200px;
  }
  .el-date-editor .el-range__close-icon {
    width: 0px !important;
  }
  .el-date-editor .el-range-input {
    width: 60% !important;
  }
}
.capital > .top > .left > .block {
  margin-left: 0px !important;
}
.el-time-spinner__item.active {
  width: 34px;
  margin-left: 13px;
}
</style>


